<template>
  <div>
    <div class="title_container" @click="onClick(TwoTitle)">
        <div class="title_wrapper">
            <div class="title_box">{{this.TwoTitle}}</div>
            <div class="title_right_icon">&gt;</div>
        </div>
    </div>  
  </div>
</template>

<script>
import Vue from "vue/dist/vue.common.js";
export default {
props:{
    TwoTitle:{
        type:String,
        default:"标题"
    }
},
methods: {
    onClick(title){//点击跳转
    var path = "";
        switch (title){
            case "全民砍价":
                path = this.$route.meta.routeDetails[0];
                break;
            case "精选专题":
                path = this.$route.meta.routeDetails[1];
                break;
            case "人气推荐":
                path = this.$route.meta.routeDetails[2];
        }
        this.$router.pushRouteByQuery(path);
    }
},
}
</script>

<style lang="scss" scoped>
.title_container{
    width: 100%;
    height: 1.8rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-bottom: 1px solid lightgray;
    .title_wrapper{
        width: 28%;
        height: 100%;
        display: inline-flex;
        justify-content: space-between;
        align-items: center;
        // background: red;
        .title_box{
            font-size: 0.7rem;
            color:gray;
        }
        .title_right_icon{
            color:gray;
        }
    }
}
</style>